<script setup>
import { NDivider, NText, NButton, NCard, NSpace, NSelect, NInput } from "naive-ui";
import { SetPlayerName } from "../../wailsjs/go/preference/Preference";
import { usePreferenceStore } from "../../stores/preference";
import { useLaunchStore } from "../../stores/launch";

const pref = usePreferenceStore()
const laun = useLaunchStore()

async function handlePlayerNameChange(value) {
    await SetPlayerName(value)
}
</script>

<template>
    <NCard hoverable :bordered="false" size="huge">
        <template #header>
            <NText :depth="3" strong>
                游戏昵称
            </NText>
        </template>
        <NInput size="large" type="text" round v-model:value="pref.playerName" @input="handlePlayerNameChange"/>
    </NCard>

    <NCard hoverable :bordered="false" size="huge">
        <template #header>
            <NText :depth="3" strong>
                游戏版本
            </NText>
        </template>
        <NSelect size="large" placeholder="select a version" v-model:value="laun.versionName"
        :options="laun.versionLists"/>
    </NCard>

    <NCard :bordered="false" size="huge">
        <template #header>
            <NSpace size="large" justify="center">
                <NButton size="large" type="success" ghost>
                    离线登录
                </NButton>
                <NButton size="large" type="success" ghost>
                    微软登录
                </NButton>
            </NSpace>
        </template>
    </NCard>
</template>

<style scoped></style>